<!DOCTYPE html>
<html lang="en">
<<<<<<< HEAD
=======
<<<<<<< HEAD
<<<<<<< HEAD
=======
>>>>>>> f98975523a13fe33f899e4108ac6391371da7f4d
>>>>>>> 491d540063cbd6c68a8e2645f31d2fbed225ee45
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
<<<<<<< HEAD
    <link rel="stylesheet" href="./css/index.css" />
    <link rel="stylesheet" href="./fonts/icomoon.css" />
  </head>
  <body>
    <div class="viewport">
      <div class="column">
        <!--概览-->
        <div class="overview panel">
          <div class="inner">
            <!-- <div class="item">
              <h4>2,190</h4>
              <span>
                <i class="icon-dot" style="color: #006cff"></i>
                设备总数
              </span>
            </div> -->
          </div>
        </div>
        <!--监控-->
        <div class="monitor panel">
          <div class="inner">
            <div class="tabs">
              <!-- <a href="javascript:;" data-index="0" class="active">故障设备监控</a> -->
              <!-- JS创建 -->
            </div>
            <div class="content" style="display: block">
              <div class="head">
                <!-- <span class="col">故障时间</span> -->
                <!-- JS创建 -->
              </div>
              <div class="marquee-view">
                <div class="marquee">
                  <!-- <div class="row">
                      <span class="col">20180701</span>
                      <span class="col">11北京市昌平西路金燕龙写字楼</span>
                      <span class="col">1000001</span>
                      <span class="icon-dot"></span>
                  </div> -->
                  <!-- JS创建 -->
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 点位 -->
        <!-- 点位 -->
        <div class="point panel">
          <div class="inner">
            <h3>点位分布统计</h3>
            <div class="chart">
              <div class="pie"></div>
              <div class="data">
                <div class="item">
                  <h4>320,11</h4>
                  <span>
                    <i class="icon-dot" style="color: #ed3f35"></i>
                    点位总数
                  </span>
                </div>
                <div class="item">
                  <h4>418</h4>
                  <span>
                    <i class="icon-dot" style="color: #eacf19"></i>
                    本月新增
                  </span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="column">
        <!-- 地图 -->
        <div class="map">
          <h3><span class="icon-cube"></span> 设备数据统计</h3>
          <div class="chart">
            <div class="geo"></div>
          </div>
        </div>
        <!-- 用户 -->
        <!-- 用户 -->
        <div class="users panel">
          <div class="inner">
            <h3>全国用户总量统计</h3>
            <div class="chart">
              <div class="bar"></div>
              <div class="data">
                <div class="item">
                  <h4>120,899</h4>
                  <span>
                    <i class="icon-dot" style="color: #ed3f35"></i>
                    用户总量
                  </span>
                </div>
                <div class="item">
                  <h4>248</h4>
                  <span>
                    <i class="icon-dot" style="color: #eacf19"></i>
                    本月新增
                  </span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="column">
        <!-- 订单 -->
        <!-- 订单 -->
        <div class="order panel">
          <div class="inner">
            <!-- 筛选 -->
            <div class="filter">
              <a href="javascript:;" data-key="day365" class="active">365天</a>
              <a href="javascript:;" data-key="day90">90天</a>
              <a href="javascript:;" data-key="day30">30天</a>
              <a href="javascript:;" data-key="day1">24小时</a>
            </div>
            <!-- 数据 -->
            <div class="data">
              <div class="item">
                <h4>20,301,987</h4>
                <span>
                  <i class="icon-dot" style="color: #ed3f35"></i>
                  订单量
                </span>
              </div>
              <div class="item">
                <h4>99834</h4>
                <span>
                  <i class="icon-dot" style="color: #eacf19"></i>
                  销售额(万元)
                </span>
              </div>
            </div>
          </div>
        </div>
        <!-- 销售额 -->
        <!-- 销售额 -->
        <div class="sales panel">
          <div class="inner">
            <div class="caption">
              <h3>销售额统计</h3>
              <a href="javascript:;" class="active" data-type="year">年</a>
              <a href="javascript:;" data-type="quarter">季</a>
              <a href="javascript:;" data-type="month">月</a>
              <a href="javascript:;" data-type="week">周</a>
            </div>
            <div class="chart">
              <div class="label">单位:万</div>
              <div class="line"></div>
            </div>
          </div>
        </div>
        <!-- 渠道 季度 -->
        <!-- 渠道 季度 -->
        <div class="wrap">
          <div class="channel panel">
            <div class="inner">
              <h3>渠道分布</h3>
              <div class="data">
                <div class="item">
                  <h4>39 <small>%</small></h4>
                  <span>
                    <i class="icon-plane"></i>
                    机场
                  </span>
                </div>
                <div class="item">
                  <h4>28 <small>%</small></h4>
                  <span>
                    <i class="icon-bag"></i>
                    商场
                  </span>
                </div>
              </div>
              <div class="data">
                <div class="item">
                  <h4>20 <small>%</small></h4>
                  <span>
                    <i class="icon-train"></i>
                    地铁
                  </span>
                </div>
                <div class="item">
                  <h4>13 <small>%</small></h4>
                  <span>
                    <i class="icon-bus"></i>
                    火车站
                  </span>
                </div>
              </div>
            </div>
          </div>
          <div class="quarter panel">
            <div class="inner">
              <h3>一季度销售进度</h3>
              <div class="chart">
                <div class="box">
                  <div class="gauge"></div>
                  <div class="label">75<small> %</small></div>
                </div>
                <div class="data">
                  <div class="item">
                    <h4>1,321</h4>
                    <span>
                      <i class="icon-dot" style="color: #6acca3"></i>
                      销售额(万元)
                    </span>
                  </div>
                  <div class="item">
                    <h4>150%</h4>
                    <span>
                      <i class="icon-dot" style="color: #ed3f35"></i>
                      同比增长
                    </span>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 排行榜 -->
        <!-- 全国热榜模块制作 -->
        <div class="top panel">
          <div class="inner">
            <div class="all">
              <h3>全国热榜</h3>
              <ul>
                <li>
                  <i class="icon-cup1" style="color: #d93f36"></i>
                  可爱多
                </li>
                <li>
                  <i class="icon-cup2" style="color: #68d8fe"></i>
                  娃哈啥
                </li>
                <li>
                  <i class="icon-cup3" style="color: #4c9bfd"></i>
                  喜之郎
                </li>
              </ul>
            </div>
            <div class="province">
              <h3>各省热销 <i class="date">// 近30日 //</i></h3>
              <div class="data">
                <ul class="sup">
                  <!-- <li>
                  <span>北京</span>
                  <span>25,179 <s class="icon-up"></s></span>
                  </li>
                  <li>
                  <span>河北</span>
                  <span>23,252 <s class="icon-down"></s></span>
                  </li> -->
                </ul>
                <ul class="sub">
                  <!-- <li><span></span><span> <s class="icon-up"></s></span></li> -->
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <script src="./js/echarts.js"></script>
    <script src="./js/jquery3.5.1.js"></script>
    <script src="./js/overview.js"></script>
    <script src="./js/monitor.js"></script>
    <script src="./js/point.js"></script>
    <script src="./js/china.js"></script>
    <script src="./js/map.js"></script>
    <script src="./js/users.js"></script>
    <script src="./js/order.js"></script>
    <script src="./js/sales.js"></script>
    <script src="./js/quarter.js"></script>
    <script src="./js/top.js"></script>
    <script>
      window.onresize = function () {
        let docClientWidth = document.documentElement.clientWidth;
        if (docClientWidth > 1902) docClientWidth = 1920;
        if (docClientWidth < 1024) docClientWidth = 1024;
        document.documentElement.style.fontSize = docClientWidth / 80 + 'px';
      };
      window.onresize();
    </script>
  </body>
</html>
=======
  </head>
  <body>
    <script>
      //ggg
      //我被改了
      //嘿嘿，我本地也该
    </script>
  </body>
</html>
<<<<<<< HEAD
=======

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>立可得_数据看板项目</title>
    <link rel="stylesheet" href="./fonts/icomoon.css">
    <link rel="stylesheet" href="./css/index.css">
</head>

<body>
    <div class="viewport">
        <div class="column">
            <!--概览-->
            <div class="overview panel">
                <!-- 边框太大, 整个标签容器又太小了, 边框图片会压缩内容 -->
                <!-- 内容部分, 用了一个inner样式来定位调整 -->
                <!-- 相对于当前panel身上的position: relative;相对定位, 而top和left都是负值,往左上角移动 -->
                <div class="inner">
                    <!-- <div class="item">
                        <h4>2,190</h4>
                        <span>
                            <i class="icon-dot" style="color: #006cff"></i>
                            设备总数
                        </span>
                    </div> -->
                </div>
            </div>
            <!--监控-->
            <div class="monitor panel">
                <div class="inner">
                    <div class="tabs">
                        <!-- <a href="javascript:;" data-index="0" class="active">故障设备监控</a> -->
                        <!-- JS创建 -->
                    </div>
                    <div class="content" style="display: block;">
                        <div class="head">
                            <!-- <span class="col">故障时间</span> -->
                            <!-- JS创建 -->
                        </div>
                        <div class="marquee-view">
                            <div class="marquee">
                                <!-- <div class="row">
                                    <span class="col">20180701</span>
                                    <span class="col">北京市昌平西路金燕龙写字楼</span>
                                    <span class="col">1000001</span>
                                    <span class="icon-dot"></span>
                                </div> -->
                                <!-- JS创建 -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 点位 -->
            <div class="point panel">
                <div class="inner">
                    <h3>点位分布统计</h3>
                    <div class="chart">
                        <div class="pie"></div>
                        <div class="data">
                            <div class="item">
                                <h4>320,11</h4>
                                <span>
                                    <i class="icon-dot" style="color: #ed3f35"></i>
                                    点位总数
                                </span>
                            </div>
                            <div class="item">
                                <h4>418</h4>
                                <span>
                                    <i class="icon-dot" style="color: #eacf19"></i>
                                    本月新增
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="column">
            <!-- 地图 -->
            <div class="map">
                <h3>
                    <span class="icon-cube"></span> 设备数据统计
                </h3>
                <div class="chart">
                    <div class="geo"></div>
                </div>
            </div>
            <!-- 用户 -->
            <div class="users panel">
                <div class="inner">
                    <h3>全国用户总量统计</h3>
                    <div class="chart">
                        <div class="bar"></div>
                        <div class="data">
                            <div class="item">
                                <h4>120,899</h4>
                                <span>
                                    <i class="icon-dot" style="color: #ed3f35"></i>
                                    用户总量
                                </span>
                            </div>
                            <div class="item">
                                <h4>248</h4>
                                <span>
                                    <i class="icon-dot" style="color: #eacf19"></i>
                                    本月新增
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="column">
            <!-- 订单 -->
            <div class="order panel">
                <div class="inner">
                    <!-- 筛选 -->
                    <div class="filter">
                        <a href="javascript:;" data-key="day365" class="active">365天</a>
                        <a href="javascript:;" data-key="day90">90天</a>
                        <a href="javascript:;" data-key="day30">30天</a>
                        <a href="javascript:;" data-key="day1">24小时</a>
                    </div>
                    <!-- 数据 -->
                    <div class="data">
                        <div class="item">
                            <h4>20,301,987</h4>
                            <span>
                                <i class="icon-dot" style="color: #ed3f35;"></i>
                                订单量
                            </span>
                        </div>
                        <div class="item">
                            <h4>99834</h4>
                            <span>
                                <i class="icon-dot" style="color: #eacf19;"></i>
                                销售额(万元)
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 销售额 -->
            <div class="sales panel">
                <div class="inner">
                    <div class="caption">
                        <h3>销售额统计</h3>
                        <a href="javascript:;" class="active" data-type="year">年</a>
                        <a href="javascript:;" data-type="quarter">季</a>
                        <a href="javascript:;" data-type="month">月</a>
                        <a href="javascript:;" data-type="week">周</a>
                    </div>
                    <div class="chart">
                        <div class="label">单位:万</div>
                        <div class="line"></div>
                    </div>
                </div>
            </div>
            <!-- 渠道 季度 -->
            <div class="wrap">
                <div class="channel panel">
                    <div class="inner">
                        <h3>渠道分布</h3>
                        <div class="data">
                            <div class="item">
                                <h4>39 <small>%</small></h4>
                                <span>
                                    <i class="icon-plane"></i>
                                    机场
                                </span>
                            </div>
                            <div class="item">
                                <h4>28 <small>%</small></h4>
                                <span>
                                    <i class="icon-bag"></i>
                                    商场
                                </span>
                            </div>
                        </div>
                        <div class="data">
                            <div class="item">
                                <h4>20 <small>%</small></h4>
                                <span>
                                    <i class="icon-train"></i>
                                    地铁
                                </span>
                            </div>
                            <div class="item">
                                <h4>13 <small>%</small></h4>
                                <span>
                                    <i class="icon-bus"></i>
                                    火车站
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="quarter panel">
                    <div class="inner">
                        <h3>一季度销售进度</h3>
                        <div class="chart">
                            <div class="box">
                                <div class="gauge"></div>
                                <div class="label">75<small> %</small></div>
                            </div>
                            <div class="data">
                                <div class="item">
                                    <h4>1,321</h4>
                                    <span>
                                        <i class="icon-dot" style="color: #6acca3"></i>
                                        销售额(万元)
                                    </span>
                                </div>
                                <div class="item">
                                    <h4>150%</h4>
                                    <span>
                                        <i class="icon-dot" style="color: #ed3f35"></i>
                                        同比增长
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 全国热榜模块制作 -->
            <div class="top panel">
                <div class="inner">
                    <div class="all">
                        <h3>全国热榜</h3>
                        <ul>
                            <li>
                                <i class="icon-cup1" style="color: #d93f36;"></i>
                                可爱多
                            </li>
                            <li>
                                <i class="icon-cup2" style="color: #68d8fe;"></i>
                                娃哈啥
                            </li>
                            <li>
                                <i class="icon-cup3" style="color: #4c9bfd;"></i>
                                喜之郎
                            </li>
                        </ul>
                    </div>
                    <div class="province">
                        <h3>各省热销 <i class="date">// 近30日 //</i></h3>
                        <div class="data">
                            <ul class="sup">
                                <!-- <li>
                                <span>北京</span>
                                <span>25,179 <s class="icon-up"></s></span>
                                </li>
                                <li>
                                <span>河北</span>
                                <span>23,252 <s class="icon-down"></s></span>
                                </li> -->
                            </ul>
                            <ul class="sub">
                                <!-- <li><span></span><span></span><s class="icon-up"></s></li> -->
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <script src="./js/jquery3.5.1.js"></script>
    <script src="./js/echarts.js"></script>
    <script>
        window.onresize = function () {
            let htmlW = document.documentElement.clientWidth;
            if (htmlW < 1024) htmlW = 1024;
            if (htmlW > 1920) htmlW = 1920; // 限制住html获取的宽度(只是为了适配不会影响html的宽度)
            document.documentElement.style.fontSize = htmlW / 80 + "px";
        }
        window.onresize();
    </script>
    <!-- 概览区域_overview -->
    <script src="./js/overview.js"></script>
    <!-- 监控区域_monitor -->
    <script src="./js/monitor.js"></script>
    <!-- 点位分布_point -->
    <script src="./js/point.js"></script>

    <!-- 地图_map -->
    <script src="./js/chinaMap.js"></script>
    <script src="./js/map.js"></script>

    <!-- 用户统计 -->
    <script src="./js/users.js"></script>

    <!-- 订单_order -->
    <script src="./js/order.js"></script>

    <!-- 销售_sales -->
    <script src="./js/sales.js"></script>

    <!-- 季度_quarter -->
    <script src="./js/quarter.js"></script>

    <!-- 排行榜_top -->
    <script src="./js/top.js"></script>
  <script>
    //测试
  </script>
</body>

</html>
>>>>>>> 98b10af (项目)
=======
>>>>>>> f98975523a13fe33f899e4108ac6391371da7f4d
>>>>>>> 491d540063cbd6c68a8e2645f31d2fbed225ee45
